<template>
  <a-card :bordered="false" style="height: 100%">
    <a-spin :spinning="loading">
      <a-input-search placeholder="按部门名称搜索…" style="margin-bottom: 10px" @search="onSearch" allowClear />
      <!--组织机构树-->
      <template v-if="treeData.length > 0">
        <a-tree v-if="!treeReloading" showLine :clickRowToExpand="false" :treeData="treeData"
          :selectedKeys="selectedKeys" :load-data="loadChildrenTreeData" v-model:expandedKeys="expandedKeys"
          @select="onSelect"></a-tree>
      </template>
      <a-empty v-else description="暂无数据" />
    </a-spin>
  </a-card>
</template>

<script lang="ts" setup>
import { inject, nextTick, ref, unref } from 'vue';
import { queryDepartTreeSync } from '../address.api';
import { searchByKeywords } from '/@/views/system/departUser/depart.user.api';
import { Popconfirm } from 'ant-design-vue';

const prefixCls = inject('prefixCls');
const emit = defineEmits(['select', 'rootTreeData']);

const loading = ref<boolean>(false);
// 部门树列表数据
const treeData = ref<any[]>([]);
// 当前展开的项
const expandedKeys = ref<any[]>([]);
// 当前选中的项
const selectedKeys = ref<any[]>([]);
// 树组件重新加载
const treeReloading = ref<boolean>(false);
// 当前选中的部门
const currentDepart = ref<any>(null);
// 搜索关键字
const searchKeyword = ref('');
// 递归函数来过滤掉 orgType 为 3 的数据
function filterOrgType(data) {
  return data
    .map(item => {
      // 递归处理子节点
      if (item.children) {
        item.children = filterOrgType(item.children);
      }

      // 仅保留 orgType 不等于 3 的节点item.orgCategory === "3" ||
      return item.orgCategory === "2" || item.orgCategory === "3" ? null : item;
    })
    .filter(item => item !== null);  // 过滤掉被标记为 null 的节点
}

// 加载顶级部门信息
async function loadRootTreeData() {
  try {
    loading.value = true;
    treeData.value = [];
    const result = await queryDepartTreeSync();
    console.log('部门树数据', result)
    if (Array.isArray(result)) {
      treeData.value = filterOrgType(result);
    }
    if (expandedKeys.value.length === 0) {
      autoExpandParentNode();
    }
  } finally {
    loading.value = false;
  }
}

loadRootTreeData();

// 加载子级部门信息
async function loadChildrenTreeData(treeNode) {
  try {
    const result = await queryDepartTreeSync({
      pid: treeNode.dataRef.id,
    });
    if (result.length == 0) {
      treeNode.dataRef.isLeaf = true;
    } else {
      treeNode.dataRef.children = filterOrgType(result);
      if (expandedKeys.value.length > 0) {
        // 判断获取的子级是否有当前展开的项
        let subKeys: any[] = [];
        for (let key of expandedKeys.value) {
          if (result.findIndex((item) => item.id === key) !== -1) {
            subKeys.push(key);
          }
        }
        if (subKeys.length > 0) {
          expandedKeys.value = [...expandedKeys.value];
        }
      }
    }
    treeData.value = [...treeData.value];
  } catch (e) {
    console.error(e);
  }
  return Promise.resolve();
}

// 自动展开父节点，只展开一级
function autoExpandParentNode() {
  let item = treeData.value[0];
  if (item) {
    if (!item.isLeaf) {
      expandedKeys.value = [item.key];
    }
    reloadTree();
  }
}

// 重新加载树组件，防止无法默认展开数据
async function reloadTree() {
  await nextTick();
  treeReloading.value = true;
  await nextTick();
  treeReloading.value = false;
}

/**
 * 设置当前选中的行
 */
function setSelectedKey(key: string, data?: object) {
  selectedKeys.value = [key];
  if (data) {
    currentDepart.value = data;
    emit('select', data);
  }
}

// 搜索事件
async function onSearch(value: string) {
  if (value) {
    try {
      loading.value = true;
      treeData.value = [];
      let result = await searchByKeywords({ keyWord: value });
      if (Array.isArray(result)) {
        treeData.value = result;
      }
      autoExpandParentNode();
    } finally {
      loading.value = false;
    }
  } else {
    loadRootTreeData();
  }
  searchKeyword.value = value;
}

// 树选择事件
function onSelect(selKeys, event) {
  if (selKeys.length > 0 && selectedKeys.value[0] !== selKeys[0]) {
    setSelectedKey(selKeys[0], event.selectedNodes[0]);
    // // 重新加载整棵树的数据
    // loadRootTreeData().then(() => {
    //   console.log('整棵树的数据已重新加载');
    // });
  } else {
    // 这样可以防止用户取消选择
    setSelectedKey(selectedKeys.value[0]);
  }
}

defineExpose({
  loadRootTreeData,
});
</script>
